<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Navigate</title>
<link href="CSS/cssAll.css" rel="stylesheet" type="text/css" />
<link href="CSS/Navigate(last).css" rel="stylesheet" type="text/css" />
<script src="JS/showPrint.js" language="javascript"></script>
<script language="javascript">
var nav = [];
nav['0']={
	name:'Main',next:[
	{name:'WOW',val:'0_0'},
	{name:'SC2',val:'0_1'},
	{name:'EVE',val:'0_2'}
	]};
nav['0_0'] = {
	name:'WOW',next:[
	{name:'Hero',val:'0_0_0'},
	{name:'Raid',val:'0_0_1'}
	]};
nav['0_0_0'] = {
	name:'Hero',next:[
	{name:'Archmage',val:'0_0_0_0'},
	{name:'Demon Hunter',val:'0_0_0_1'}	
	]};

var count=nav.length;
function tree(i){
	var oSt=document.getElementById(i);
	oSt.style.display="block";
}
function hidd(i){
	var oSt=document.getElementById(i);
	oSt.style.display="none";
}
function createList(){
	var oBox = document.getElementById('box');
	var i='0';
	var oObj = create(i);
	oBox.appendChild(oObj);	
}

function create(i){
		var oUl = document.createElement('ul');
		oUl.id = nav[i].name;
		for(var j=0;j< nav[i].next.length;j++){
			var oLi = document.createElement('li');
			var flag = nav[i].next[j].val;
			var oText = document.createTextNode(nav[i].next[j].name);
			oLi.appendChild(oText);
			if(nav[flag]){
				oLi.appendChild(create(flag));	
			}
			oUl.appendChild(oLi);
			show(oText);
		}
		return oUl;
}
</script>
</head>

<body onload="createList()">
<div id="box" class="navRoot">

</div>
</body>
</html>
